import Vue from 'vue'
// 以前写法喜欢写成VueRouter 但这个只是个变量名字，在人资项目起的名字是Router
import Router from 'vue-router'

// 使用插件Router
Vue.use(Router)

/* Layout */
// 导入布局组件
import Layout from '@/layout'

// 引入多个模块的规则
import approvalsRouter from './modules/approvals'
import departmentsRouter from './modules/departments'
import employeesRouter from './modules/employees'
import permissionRouter from './modules/permission'
import attendancesRouter from './modules/attendances'
import salarysRouter from './modules/salarys'
import settingRouter from './modules/setting'
import socialRouter from './modules/social'

/**
 * Note: sub-menu only appear when route children.length >= 1
 * Detail see: https://panjiachen.github.io/vue-element-admin-site/guide/essentials/router-and-nav.html
 *
 * hidden: true                   if set true, item will not show in the sidebar(default is false)
 * alwaysShow: true               if set true, will always show the root menu
 *                                if not set alwaysShow, when item has more than one children route,
 *                                it will becomes nested mode, otherwise not show the root menu
 * redirect: noRedirect           if set noRedirect will no redirect in the breadcrumb
 * name:'router-name'             the name is used by <keep-alive> (must set!!!)
 * meta : {
    roles: ['admin','editor']    control the page roles (you can set multiple roles)
    title: 'title'               the name show in sidebar and breadcrumb (recommend set)
    icon: 'svg-name'/'el-icon-x' the icon show in the sidebar
    breadcrumb: false            if set false, the item will hidden in breadcrumb(default is true)
    activeMenu: '/example/list'  if set path, the sidebar will highlight the path you set
  }
 */

/**
 * constantRoutes
 * a base page that does not have permission requirements
 * all roles can be accessed
 */
// 配置路由规则
// 动态路由表 =》 动态路由(需要权限才可以访问)
export const asyncRoutes = [
  departmentsRouter,
  settingRouter,
  employeesRouter,
  permissionRouter,
  approvalsRouter,
  attendancesRouter,
  salarysRouter,
  socialRouter
]

// 静态路由表 =》 静态路由(不需要权限即可访问)
export const constantRoutes = [
  {
    path: '/login', // path配置路径
    // 路由懒加载 - 提高性能 箭头函数
    // 箭头函数访问对应的页面后会执行拿到对应的组件从而达到懒加载的目的
    component: () => import('@/views/login/index'),
    // hidden 控制路由显示隐藏
    hidden: true
  },

  {
    path: '/404',
    component: () => import('@/views/404'),
    hidden: true
  },

  // 首页模块
  {
    path: '/',
    // layout没有懒加载 布局组件一般不用懒加载
    // 只有用户后面进行些操作才能看到的页面，可以使用懒加载
    component: Layout,
    // 重定向到首页
    redirect: '/dashboard',
    // 配置二级路由，配置首页
    children: [{
      path: 'dashboard',
      name: 'dashboard',
      component: () => import('@/views/dashboard/index'),
      // meta后续会讲，元数据
      meta: { title: '首页', icon: 'dashboard' }
    }]
  },

  // 组织架构模块
  // {
  //   path: '/',
  //   component: Layout,
  //   children: [{
  //     path: 'departments',
  //     component: () => import('@/views/departments'),
  //     meta: { title: '组织架构', icon: 'tree' }
  //   }]
  // },
  // departmentsRouter,

  // 404 page must be placed at the end !!!
  { path: '*', redirect: '/404', hidden: true }
]

// createRouter是个箭头函数 函数执行后创建实例
// 以前都是直接new Router为什么这里要封装函数？
// 函数 - 封装复用 - 为了复用
const createRouter = () => new Router({
  // mode: 'history', // require service support
  /**
   * 切换页面控制滚动条的位置 需求：切换页面回到顶部
   * 配置的是个函数 这里写的是箭头函数
   * @returns 返回对象，属性x和y标记的滚动条的位置
   */
  scrollBehavior: () => ({ y: 0 }),
  // scrollBehavior: () => {
  //   return {
  //     y: 0 // 滚动条到最上面
  //   }
  // }
  routes: [...constantRoutes, ...asyncRoutes] // 临时合并动态路由和静态路由
  // routes: constantRoutes // 以前可能直接在这里配置数组，现在提了个变量，一样的
})

// 调用箭头函数 返回值router的实例
const router = createRouter()

// Detail see: https://github.com/vuejs/vue-router/issues/1234#issuecomment-357941465
/**
 * 重置路由 - 花裤衩大佬提供的方法
 * 1. 必须重新实例化
 * 2. 必须覆盖router的属性matcher
 *
 * 重置的应用场景
 * 做权限功能时，假设A员工对应的角色有A，B，C，D，E页面等权限
 * 然后呢A员工退出登录 登录B员工
 * B员工对应的页面权限只有A，B，C，但是此时不重置路由他通过url还可以访问D，E，F
 * 所以我们需要重置路由
 */
export function resetRouter() {
  const newRouter = createRouter()
  router.matcher = newRouter.matcher // reset router
}

// 默认导出
export default router
